<template>
    <div class="appBottom flex-between-center pcHide">
        <div class="iconItem flex-center" v-for="(item,index) in iconList" :key="index"
            @click="appBottomSelect(index,item)">
            <i v-if="item.icon" :class='selectedIndex==index?item.selectIcon:item.icon' class="iconfont"></i>
            <img v-if="item.isImg" class='wh100' src='./images/voiceBtn.png'></img>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                iconList: [
                    {
                        icon: 'icon_Tab_shouye_Initial',
                        selectIcon: 'icon_Tab_shouye_Selected',
                        page: 'home',
                        title: '系统首页',
                        route: '/index/home'
                    },
                    {
                        icon: 'icon_Tab_shebeiliebiao_Initial',
                        selectIcon: 'icon_Tab_shebeiliebiao_Selected',
                        page: 'equipList',
                        title: '设备列表',
                        route: '/index/equipListsIot'
                    },
                    {
                        isImg: true          //语音
                    },
                    {
                        icon: 'icon_Tab_gongnengmokuai_Initial',
                        selectIcon: 'icon_Tab_gongnengmokuai_Selected',
                        page: 'modules',
                        title: '功能模块',
                        route: '/index/modules'
                    },
                    {
                        icon: 'icon_Tab_shezhi_Initial',
                        selectIcon: 'icon_Tab_gongnengmokuai_Selected',
                        page: 'set',
                        title: '设置',
                        route: '/index/setPage'
                    }

                ],
                selectedIndex: 0
            }
        },
        mounted() {

        },
        methods: {
            appBottomSelect(index, item) {
                if (index != 2 && index != this.selectedIndex) {
                    this.selectedIndex = index
                    this.$router.push({ path: item.route })
                }
                this.$emit('bottomSelect', index, item);

            }
        }
    }
</script>

<style lang='scss' src='./css/bottom.scss'>

</style>